<template>
     <div>
        <div v-for="(item,index) in list" :key="index">{{item}} <span @click="reduce(index)">删除</span></div>
      <!-- （1）点击这个删除按钮 是在子组件中
            （2）数据在父组件中
       -->
     </div>
</template>

<script>
export default {
   props:{
    list:{
        type:Array
    }
   },
   methods:{
    reduce(index){
        console.log(index);
        //在组件向组件传递数据=》$emit('事件名称',数据)

        // console.log(this);
        this.$emit('reduce',index)  //@reudce =>click
        
    }
   }
}
</script>

<style>

</style>